import { _decorator, Component, Node } from 'cc';
import { BaseView } from '../../../../../scripts/libs/rxjs/cc3/BaseView';
import { LeaderboardScrollView } from '../../LeaderboardPanel/LeaderboardScrollView';
import { LeaderboardItem } from '../../LeaderboardPanel/LeaderboardItem';
import { Timer } from '../../../../../scripts/libs/rxjs/cc3/CreatorSchedule';
import { optimizeScrollView } from '../../../../../scripts/libs/utils/ScrollView/OptimizeScrollView';
import { pfm } from '../../../../../scripts/managers/PlayFabManager';
import { MergeASAP } from '../../../../../scripts/libs/rxjs/cc3/Merge';
import { udm } from '../../../../../scripts/managers/UserDataManager';
import { ReactiveProperty } from '../../../../../scripts/libs/rxjs/cc3/ReactiveProperty';
import { CCBindScrollView } from '../../../../../scripts/libs/rxjs/cc3/BindScrollView';
import { ScrollView } from 'cc';
import { TweenToStart } from '../../../../../scripts/libs/rxjs/cc3/TweenStart';
import { v3 } from 'cc';
import { gm } from '../../../../../scripts/managers/GameManager';
import { Vec3 } from 'cc';
import { lm } from '../../../LobbyManager';
import { UITransform } from 'cc';
import { Widget } from 'cc';
import { linear } from '../../../../../scripts/libs/utils/math';
const { ccclass, property } = _decorator;

@ccclass('LeaderboardPage')
export class LeaderboardPage extends BaseView {

    @property(Node)
    viewNode: Node = null;

    @property(Node)
    tapNode: Node = null;

    @property(LeaderboardScrollView)
    scrollView: LeaderboardScrollView = null;

    @property(LeaderboardItem)
    myLeaderboardItem: LeaderboardItem = null;

    scrollViewReady = ReactiveProperty.Create(false);

    scrollViewDidOpen = false;

    @property(Node)
    loadingIndicatorNode: Node = null;

    willBind(): void {
        this.scrollView.leaderboardPage = this;
        this.adaptive();
    }

    useObserves() {
        return [
            MergeASAP(pfm.entityId, udm.displayName, pfm.myRanking, this.scrollViewReady).subscribe(this.refreshMeItem.bind(this)),
            CCBindScrollView(this.scrollView.getComponent(ScrollView)).subscribe(this.handleScrollView.bind(this)),
            this.scrollViewReady.subscribe(_ => this.loadingIndicatorNode.active = !_),
        ];
    }

    adaptive() {
        let scale = Math.min(lm.getAdaptiveScale(), 1);
        let scaleV3 = v3(Vec3.ONE).multiplyScalar(scale);
        this.viewNode.setScale(scaleV3);
        this.myLeaderboardItem.node.setScale(scaleV3);
        this.tapNode.setScale(scaleV3);
        let diffY = this.tapNode.getComponent(UITransform).height * (1 - scale);
        this.tapNode.getComponent(Widget).top += diffY;
    }

    onLoadView() {
        this.myLeaderboardItem.isMe.value = true;
    }

    openScrollView() {
        this.scrollViewDidOpen = true;
        Timer(.2, this.node).subscribe(_ => {
            // let targetRank = pfm.myRanking.value?.Rank ?? 0;
            this.scrollView.open('default', 0);
            optimizeScrollView(this.scrollView.scrollView);

            // if (targetRank > 5) {
            //     let contentTargetY = -this.scrollView.getYPostion(targetRank) + 100;
            //     TweenToStart(this.scrollView.content, .4, { position: v3(0, contentTargetY, 0) }, { easing: 'quadOut' }).subscribe().addTo(this.node);
            // }
            // this.scrollViewReady.value = true;
        }).addTo(this.node);
    }

    refreshMeItem() {

        let data = {
            _status: 1,
            ranking: {
                Entity: { Id: pfm.entityId.value },
                DisplayName: udm.displayName.value,
                Rank: pfm.myRanking.value?.Rank ?? '1000+',
                Scores: [pfm.myRanking.value?.Scores?.[0] ?? [udm.stageNum.value]],
            }
        };

        this.myLeaderboardItem.setItem(data);

        // myItem机制：当前展示名次在自己以上时显示,boke 不要这种
        // if (this.scrollViewReady.value) {
        //     let scale = Math.min(lm.getAdaptiveScale(), 1);
        //     let adaptive_diff_y = linear(.7, 1, 0, 90, scale);
        //     let hideY = ((pfm.myRanking.value?.Rank ?? 1) - 1) * this.scrollView.itemHeight + this.scrollView.headHeight + this.myLeaderboardItem.node.position.y + adaptive_diff_y;
        //     if (this.scrollView.content.position.y > hideY) {
        //         this.myLeaderboardItem.node.active = false;
        //         gm.myLeaderboardItemHide.value = true;
        //     } else {
        //         this.myLeaderboardItem.node.active = true;
        //         gm.myLeaderboardItemHide.value = false;
        //     }
        // } else {
        //     this.myLeaderboardItem.node.active = false;
        //     gm.myLeaderboardItemHide.value = true;
        // }
    }

    handleScrollView(param) {
        if (param.state == 'scrolling') {
            this.refreshMeItem();
        }
    }

}

